<template>
    <view class="content">
        <view class="topContent">
            <u--form ref="uForm" :model="thisData" :rules="rules" label-width="120" labelAlign="center" :disabled="!isEdit">
                <u-form-item label="钢丝绳编码" borderBottom prop="code">
                    <view class="w-100">
                        <u-input v-model="thisData.code" disabled placeholder="请输入钢丝绳编码" />
                    </view>
                </u-form-item>
                <u-form-item label="钢丝绳名称" borderBottom prop="name" class="relativeCol">
                    <view class="w-100">
                        <u-input v-model="thisData.name" placeholder="请输入钢丝绳名称" />
                    </view>
                </u-form-item>
                <u-form-item label="规格型号" borderBottom prop="guiGe" class="relativeCol">
                    <view class="w-100">
                        <u-input v-model="thisData.guiGe" placeholder="请输入规格型号" />
                    </view>
                </u-form-item>
                <u-form-item label="直径" borderBottom prop="diameter" class="relativeCol">
                    <view class="w-100">
                        <u-input type="number" :formatter="$gx.inputFormatter" v-model="thisData.diameter" placeholder="请输入直径">
                            <u--text text="mm" slot="suffix" type="tips"></u--text>
                        </u-input>
                    </view>
                </u-form-item>
                <u-form-item label="公称捻距" borderBottom prop="nianJu" class="relativeCol">
                    <view class="w-100">
                        <u-input type="number" :formatter="$gx.inputFormatter" v-model="thisData.nianJu" placeholder="请输入公称捻距">
                            <u--text text="mm" slot="suffix" type="tips"></u--text>
                        </u-input>
                    </view>
                </u-form-item>
                <u-form-item label="抗拉强度" prop="thisData.mpaID" borderBottom>
                    <DataSelect class="w-100" table="Mpa" :id.sync="thisData.mpaID" :name.sync="thisData.mpaName" @onShow="onPreviewShow" @onClose="onPreviewHide"> </DataSelect>
                </u-form-item>
                <u-form-item label="表面状态" prop="thisData.surfaceStatusID" borderBottom>
                    <DataSelect class="w-100" table="SurfaceStatus" :id.sync="thisData.surfaceStatusID" :name.sync="thisData.surfaceStatusName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="捻制类型" prop="thisData.twistingTypeID" borderBottom>
                    <DataSelect class="w-100" table="TwistingType" :id.sync="thisData.twistingTypeID" :name.sync="thisData.twistingTypeName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="长度" borderBottom prop="lengthNum" class="relativeCol">
                    <view class="w-100">
                        <u-input type="number" :formatter="$gx.inputFormatter" v-model="thisData.lengthNum" placeholder="请输入长度">
                            <u--text text="m" slot="suffix" type="tips"></u--text>
                        </u-input>
                    </view>
                </u-form-item>
                <u-form-item label="绳子条数" borderBottom prop="cnt" class="relativeCol">
                    <view class="w-100">
                        <u-input type="number" :formatter="(e) => {return $gx.inputFormatter(e, 0);}" v-model="thisData.cnt" placeholder="请输入绳子条数">
                            <u--text text="根" slot="suffix" type="tips"></u--text>
                        </u-input>
                    </view>
                </u-form-item>
                <u-form-item label="维保周期" borderBottom prop="keepDay" class="relativeCol">
                    <view class="w-100">
                        <u-input type="number" :formatter="(e) => {return $gx.inputFormatter(e, 0);}" v-model="thisData.keepDay" placeholder="请输入维保周期">
                            <u--text text="天" slot="suffix" type="tips"></u--text>
                        </u-input>
                    </view>
                </u-form-item>
                <u-form-item label="供应商" borderBottom prop="supplierID" class="relativeCol">
                    <DataSelect class="w-100" table="Supplier" :id.sync="thisData.supplierID" :name.sync="thisData.supplierName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="制造商" borderBottom prop="producerID" class="relativeCol">
                    <DataSelect class="w-100" table="Producer" :id.sync="thisData.producerID" :name.sync="thisData.producerName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="矿山" prop="thisData.departmentID" borderBottom>
                    <DataSelect class="w-100" table="Department" :filter="{ _Type: $enums.Department_Type.矿山 }" :id.sync="thisData.departmentID" :name.sync="thisData.department_Name" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>

                <u-form-item label="提升机类型" prop="thisData.hoisterID" borderBottom>
                    <DataSelect class="w-100" table="Hoister" :id.sync="thisData.hoisterID" :name.sync="thisData.hoisterName" @onChange="hoisterChange" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="提升机用途" prop="thisData.hoisterUsageID" borderBottom>
                    <DataSelect ref="HoisterUsageRef" class="w-100" table="HoisterUsage" :filter="{ _HoisterID: thisData.hoisterID }" :id.sync="thisData.hoisterUsageID" :name.sync="thisData.hoisterUsageName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>
                <u-form-item label="钢丝绳类型" prop="thisData.wireropeTypeID" borderBottom>
                    <DataSelect ref="WireropeTypeRef" class="w-100" table="WireropeType" :filter="{ _HoisterID: thisData.hoisterID }" :id.sync="thisData.wireropeTypeName" :name.sync="thisData.wireropeTypeName" @onShow="onPreviewShow" @onClose="onPreviewHide"></DataSelect>
                </u-form-item>

                <u-form-item label="备注" borderBottom prop="remark" class="relativeCol">
                    <view class="w-100">
                        <u-input v-model="thisData.remark" type="textarea" placeholder="请输入备注"> </u-input>
                    </view>
                </u-form-item>

                <u-form-item label="出厂报告" borderBottom>
                    <view class="w-100">
                        <Upload ref="chuChangUploadRef" v-model="thisData.chuChang_FilesList" :limit="30" @onPreviewShow="onPreviewShow" @onPreviewHide="onPreviewHide"></Upload>
                    </view>
                </u-form-item>
                <u-form-item label="验收报告" borderBottom>
                    <view class="w-100">
                        <Upload ref="yanShouUploadRef" v-model="thisData.yanShou_FilesList" :limit="30" @onPreviewShow="onPreviewShow" @onPreviewHide="onPreviewHide"></Upload>
                    </view>
                </u-form-item>
                <u-form-item label="倒卷检测报告" borderBottom>
                    <view class="w-100">
                        <Upload ref="jianCeUploadRef" v-model="thisData.jianCe_FilesList" :limit="30" @onPreviewShow="onPreviewShow" @onPreviewHide="onPreviewHide"></Upload>
                    </view>
                </u-form-item>
                <u-form-item label="附件" borderBottom>
                    <view class="w-100">
                        <Upload ref="attrUploadRef" v-model="thisData.attr_FilesList" :limit="30" @onPreviewShow="onPreviewShow" @onPreviewHide="onPreviewHide"></Upload>
                    </view>
                </u-form-item>
            </u--form>
            <view class="mart-30">
                <u-row justify="center">
                    <u-col span="6">
                        <u-button type="primary" @click="submit">保存</u-button>
                    </u-col>
                </u-row>
            </view>
        </view>
        <u-toast ref="uToast"></u-toast>
    </view>
</template>

<script>
export default {
    data() {
        return {
            thisID: null,
            thisData: {
                code: "",
            },
            rules: {
                code: [
                    {
                        required: true,
                        message: "钢丝绳编码",
                        trigger: ["blur", "change"],
                    },
                ],
            },
        };
    },
    //生命周期-加载
    onLoad: function (option) {
        let that = this;
        // #ifdef APP-NVUE
        const eventChannel = this.$scope.eventChannel; // 兼容APP-NVUE
        // #endif

        // #ifndef APP-NVUE
        const eventChannel = this.getOpenerEventChannel();
        // #endif
        eventChannel.on("editData", function (data) {
            that.init(data.data, 1);
        });
        eventChannel.on("addData", function (data) {
            that.init(data.data, 0);
        });
    },
    onReady() {
        //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
        this.$nextTick(() => {
            this.$refs.uForm.setRules(this.rules);
        });
    },
    methods: {
        init(data, type) {
            // type1编辑0添加
            if (data.stockID) {
                this.thisID = data.stockID;
                this.$app.CallApi(this.$app.api.Stock.GetByID(this.thisID), {
                    success: (res) => {
                        this.thisData = res;

                        if (!this.$gx.IsEmpty(res.hoisterID)) {
                            this.$nextTick(() => {
                                this.$refs.HoisterUsageRef.initList();
                                this.$refs.WireropeTypeRef.initList();
                            });
                        } else {
                            this.$refs.HoisterUsageRef.clearData();
                            this.$refs.HoisterUsageRef.clearList();

                            this.$refs.WireropeTypeRef.clearData();
                            this.$refs.WireropeTypeRef.clearList();
                        }
                    },
                });
            }
        },
        submit() {
            this.$refs.uForm
                .validate()
                .then((res) => {
                    let apiFun = this.$app.api.Stock.Insert;
                    if (this.thisID) {
                        apiFun = this.$app.api.Stock.Update;
                    }
                    this.$app.CallApi(apiFun, {
                        data: this.thisData,
                        success: (res) => {
                            this.$refs.uToast.show({
                                type: "success",
                                title: "",
                                message: "保存成功！",
                                complete: () => {
                                    uni.navigateBack();
                                    uni.$emit("refreshData");
                                },
                            });
                        },
                    });
                })
                .catch((errors) => {});
        },
        //提升机类型选择
        hoisterChange(val) {
            this.$refs.HoisterUsageRef.clearData();
            this.$refs.HoisterUsageRef.clearList();

            this.$refs.WireropeTypeRef.clearData();
            this.$refs.WireropeTypeRef.clearList();

            if (this.$gx.IsEmpty(this.thisData.hoisterID)) {
                return;
            }

            this.$nextTick(() => {
                this.$refs.HoisterUsageRef.initList();
                this.$refs.WireropeTypeRef.initList();
            });
        },
        //文件预览开启
        onPreviewShow() {
            this.$refs.chuChangUploadRef.setReadOnly(true);
            this.$refs.yanShouUploadRef.setReadOnly(true);
            this.$refs.jianCeUploadRef.setReadOnly(true);
            this.$refs.attrUploadRef.setReadOnly(true);
        },
        //文件预览关闭
        onPreviewHide() {
            this.$refs.chuChangUploadRef.setReadOnly(false);
            this.$refs.yanShouUploadRef.setReadOnly(false);
            this.$refs.jianCeUploadRef.setReadOnly(false);
            this.$refs.attrUploadRef.setReadOnly(false);
        },
    },
    props: {
        isEdit: {
            type: Boolean,
            default: true,
        },
    },
};
</script>

<style></style>
